<template>
  <FullscreenCard class="home-wrap">
		<Videojs :src="videoUrl" @ended="onEnded"/>
		<el-button @click="play(-1)">上一条</el-button>
		<el-button @click="play(1)">下一条</el-button>
	</FullscreenCard>
</template>

<script setup lang="ts">
import FullscreenCard from '@/components/FullscreenCard'
import Videojs from '@/components/Videojs'

const dataList = ref([
	'https://st.92kk.com//2025/车载视频/202501/20250108/[Mp4]只要你还需要我_王韵_[Dj阿远_Extended_Mix国语男]车载音乐精品影视视频1080P高清[独].mp4',
	'https://cesium.com/public/SandcastleSampleData/big-buck-bunny_trailer.mp4',
	'https://st.92kk.com//2025/车载视频/202501/20250108/[Mp4]38度6_黑龙_[DJ小鱼儿_Extended]车载音乐精品影视视频1080P高清[独].mp4',
	'https://st.92kk.com//2025/车载视频/202501/20250108/[Mp4]酒过三巡终会醉_曾诗涵_[DJ光波版]车载音乐精品影视视频1080P高清[独].mp4',
	'https://st.92kk.com//2025/车载视频/202501/20250108/[Mp4]我们不求下辈子_王羽泽_[Dj阿远_Dance_Mix国语男]车载音乐精品影视视频1080P高清[独].mp4	',
	'https://st.92kk.com//2025/车载视频/202501/20250108/[Mp4]今夜想喝醉_庄闲_[Dj沈念_ProgHouse_Mix国语男]]车载音乐精品影视视频1080P高清[独].mp4	',
	'https://st.92kk.com//2025/车载视频/202501/20250108/[Mp4]你不配我的泪_花小花_[Dj伟然_ProgHouse_Mix国语女]_车载音乐精品影视视频1080P高清[独].mp4',
])
const videoCurIndex = ref(0)
const videoUrl = ref(dataList.value[videoCurIndex.value])
const play = (idx: number) => {
	// length+videoCurIndex+index,length为视频列表长度,循环播放
	const len = dataList.value.length
	const i = (videoCurIndex.value + idx + len) % len
	videoCurIndex.value = i
	videoUrl.value = dataList.value[i]
}
const onEnded = () => {
	play(1)
}
onMounted(() => {
})
</script>

<style lang="scss" scoped>
.home-wrap {
  padding: 20px;
	background-color: var(--vt-c-white);
}
</style>